@extends('layouts.admin.application')

@section('css')
    <link rel="stylesheet" href="/ace/assets/css/datepicker.css">
@endsection

@section('content')
    <div class="main-content">
        <div class="col-xs-12">
            <div class="breadcrumbs" id="breadcrumbs">
                <ul class="breadcrumb">
                    <li><i class="icon-home home-icon"></i><a href="#">首页</a></li>
                    <li><a href="{{ route('cashier.purchase.index') }}">商品管理</a></li>
                    <li class="active">新增商品</li>
                </ul>
            </div>

            @include('layouts.partials._flash')

            <form class="form-horizontal" role="form" action="{{ route('cashier.purchase.store') }}" method="post"
                  style="margin-top: 10px;">
                {{csrf_field()}}
                <div class="col-sm-12">
                    <div class="tabbable">
                        <ul class="nav nav-tabs" id="myTab">
                            <li class="active">
                                <a data-toggle="tab" href="#home">
                                    <i class="green icon-home bigger-110"></i>
                                    基本信息
                                </a>
                            </li>

                            <li class="">
                                <a data-toggle="tab" href="#profile">
                                    <i class="green icon-h-sign bigger-110"></i>
                                    商品关联信息
                                </a>
                            </li>

                            <li class="">
                                <a data-toggle="tab" href="#dropdown">
                                    <i class="green icon-rocket bigger-110"></i>
                                    副本信息
                                </a>
                            </li>
                        </ul>

                        <div class="tab-content">
                            <div id="home" class="tab-pane active" style="margin-top: 20px;">
                                <div class="form-group">
                                    <label class="col-sm-3 control-label no-padding-right">商品名称</label>

                                    <div class="col-sm-9">
                                        <input type="text" name="name" placeholder="商品名称，你懂得~"
                                               class="col-xs-10 col-sm-5">
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label class="col-sm-3 control-label no-padding-right">商品条码</label>

                                    <div class="col-sm-9">
                                        <input type="text" name="code" placeholder="商品条码，你懂得~" class="col-xs-10 col-sm-5">
                                    </div>
                                </div>

                                <div class="form-group">
                                    <label class="col-sm-3 control-label no-padding-right">单位</label>

                                    <div class="col-sm-9">
                                        <select class="col-xs-10 col-sm-5" name="unit">
                                            <option value="0">请选择</option>
                                            <option value="1">盒</option>
                                            <option value="2">瓶</option>
                                            <option value="3">袋</option>
                                            <option value="4">支</option>
                                        </select>
                                    </div>
                                </div>

                                <div class="form-group">
                                    <label class="col-sm-3 control-label no-padding-right">零售价</label>

                                    <div class="col-sm-9">
                                        <input type="text" name="price" class="col-xs-10 col-sm-5">
                                    </div>
                                </div>

                                <div class="form-group">
                                    <label class="col-sm-3 control-label no-padding-right">会员价</label>

                                    <div class="col-sm-9">
                                        <input type="text" name="member_price" class="col-xs-10 col-sm-5">
                                    </div>
                                </div>

                                <div class="form-group">
                                    <label class="col-sm-3 control-label no-padding-right">进货价</label>

                                    <div class="col-sm-9">
                                        <input type="text" name="purchase_price" class="col-xs-10 col-sm-5">
                                    </div>
                                </div>

                                <div class="form-group">
                                    <label class="col-sm-3 control-label no-padding-right">规格</label>

                                    <div class="col-sm-9">
                                        <input type="text" name="spec" class="col-xs-10 col-sm-5">
                                    </div>
                                </div>

                                <div class="form-group">
                                    <label class="col-sm-3 control-label no-padding-right">库存</label>

                                    <div class="col-sm-9">
                                        <input type="text" name="stock" class="col-xs-10 col-sm-5">
                                    </div>
                                </div>

                                <div class="form-group">
                                    <label class="col-sm-3 control-label no-padding-right">有效期</label>

                                    <div class="col-sm-9">
                                        <div class="input-group" style="width: 358px;">
                                            <input type="text" name="valid_at" class="form-control datepicker">
                                            <span class="input-group-addon"><i class="icon-calendar bigger-110"></i></span>
                                        </div>
                                    </div>
                                </div>

                                <div class="form-group">
                                    <label class="col-sm-3 control-label no-padding-right">生产厂家</label>

                                    <div class="col-sm-9">
                                        <input type="text" name="company" class="col-xs-10 col-sm-5">
                                    </div>
                                </div>
                            </div>

                            <div id="profile" class="tab-pane" style="margin-top: 20px;">
                                <div class="form-group">
                                    <label class="col-sm-3 control-label no-padding-right">所属门店</label>

                                    <div class="col-sm-9">
                                        <select class="col-xs-10 col-sm-5" name="store_id">
                                            <option value="0">请选择</option>
                                            @foreach($stores as $store)
                                                <option value="{{$store->id}}">{{$store->name}}</option>
                                            @endforeach
                                        </select>
                                    </div>
                                </div>

                                <div class="form-group">
                                    <label class="col-sm-3 control-label no-padding-right">商品分类</label>

                                    <div class="col-sm-9">
                                        <select class="col-xs-10 col-sm-5" name="category_id">
                                            <option value="0">顶级分类</option>
                                            @foreach($categories as $category)
                                                <option value="{{$category->id}}">
                                                {{$category->name}}
                                                @foreach($category->children as $c)
                                                    <option value="{{$c->id}}">
                                                        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{{$c->name}}
                                                    </option>
                                                    @endforeach
                                                    </option>
                                                @endforeach
                                        </select>
                                    </div>
                                </div>

                                <div class="form-group">
                                    <label class="col-sm-3 control-label no-padding-right">商品品牌</label>

                                    <div class="col-sm-9">
                                        <select class="col-xs-10 col-sm-5" name="brand_id">
                                            <option value="0">请选择</option>
                                            @foreach($brands as $brand)
                                                <option value="{{$brand->id}}">{{$brand->name}}</option>
                                            @endforeach
                                        </select>
                                    </div>
                                </div>

                                <div class="form-group">
                                    <label class="col-sm-3 control-label no-padding-right">商品缩略图</label>

                                    <div class="col-sm-9">
                                        <div class="am-form-group am-form-file new_thumb">
                                            <button type="button" class="btn-success upload_img">
                                                <i class="icon-cloud-upload" id="loading"></i> 上传商品图片
                                            </button>
                                            <input type="file" id="image_upload" style="display: none;">
                                            <input type="hidden" name="image">
                                        </div>
                                        <hr style="border-top:1px dashed #0066CC;">
                                        <div>
                                            <img src="" id="img_show" style="max-height: 200px;">
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <div id="dropdown" class="tab-pane" style="margin-top: 20px;">
                                <div class="form-group">
                                    <label class="col-sm-3 control-label no-padding-right">录入人</label>

                                    <div class="col-sm-9">
                                        <input type="text" name="entry" class="col-xs-10 col-sm-5">
                                    </div>
                                </div>

                                <div class="form-group">
                                    <label class="col-sm-3 control-label no-padding-right">排序</label>

                                    <div class="col-sm-9">
                                        <input type="text" name="sort_order" class="col-xs-10 col-sm-5">
                                    </div>
                                </div>

                                <div class="form-group">
                                    <label class="col-sm-3 control-label no-padding-right">加入推荐</label>

                                    <div class="col-sm-9">

                                        <input type="hidden" name="is_top" value="0">
                                        <input type="hidden" name="is_recommend" value="0">
                                        <input type="hidden" name="is_hot" value="0">
                                        <input type="hidden" name="is_new" value="0">

                                        <div data-toggle="buttons" class="btn-group">
                                            <label class="btn btn-sm">
                                                <input type="checkbox" name="is_top" value="1">置顶
                                                <i class="icon-only bigger-110"></i>
                                            </label>

                                            <label class="btn btn-sm">
                                                <input type="checkbox" name="is_recommend" value="1">推荐
                                                <i class="icon-only bigger-110"></i>
                                            </label>

                                            <label class="btn btn-sm">
                                                <input type="checkbox" name="is_hot" value="1">热销
                                                <i class="icon-only bigger-110"></i>
                                            </label>

                                            <label class="btn btn-sm">
                                                <input type="checkbox" name="is_new" value="1">新品
                                                <i class="icon-only bigger-110"></i>
                                            </label>
                                        </div>
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label class="col-sm-3 control-label no-padding-right">是否上架</label>

                                    <div class="col-sm-9">
                                        <div data-toggle="buttons" class="btn-group">
                                            <label class="btn btn-sm">
                                                <input type="radio" name="is_onsale" value="1">是
                                                <i class="icon-only"></i>
                                            </label>

                                            <label class="btn btn-sm active">
                                                <input type="radio" name="is_onsale" value="0">否
                                                <i class="icon-only"></i>
                                            </label>

                                        </div>
                                    </div>
                                </div>

                                <div class="form-group">
                                    <label class="col-sm-3 control-label no-padding-right">商品描述</label>

                                    <div class="col-sm-9">
                                        <textarea id="description" name="description" cols="47" rows="7"></textarea>

                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="clearfix form-actions">
                    <div class="col-md-offset-3 col-md-9" style="margin-top: 20px;">
                        <button class="btn btn-info" type="submit"><i class="icon-ok bigger-110"></i>保存</button>
                        &nbsp; &nbsp; &nbsp;
                        <a class="btn" onclick="javascript:history.back(-1);return false;">
                            <i class="icon-undo bigger-110"></i>返回</a>
                    </div>
                </div>
            </form>
        </div>
    </div>
@endsection

@section('js')
    <script src="/vendor/html5-fileupload/jquery.html5-fileupload.js"></script>
    <script src="/js/upload.js"></script>
    <script src="/ace/assets/js/date-time/bootstrap-datepicker.min.js"></script>
    <script src="/ace/assets/js/date-time/bootstrap-datepicker.zh-CN.js"></script>
    <script src="/ace/assets/js/date-time/moment.min.js"></script>
    <script>
        $(function () {
            $('.datepicker').datepicker({
                format: 'yyyymmdd',
                language: 'zh-CN'
            });
        })
    </script>
@endsection